<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style>
			div{
				width: 800px;
				border:1px red solid;
				/*text-align 文本的水平对齐
				    可选值：
				     left 左侧对齐
				     right 右侧对齐
				     center 居中对齐
				     justify 两端对齐*/
				    font-size: 50px;
				    text-align: center;
			}
			span{
				font-size: 20px;
				border:1px blue solid;
				/*vertical-align 设置元素垂直对齐的方式
				    可选值：
				       baseline 默认值 基线对齐
				       top 顶部对齐
				       bottom 底部对齐
				       middle 居中对齐
				       */
				      vertical-align:middle;
			}
			p{
				border: 4px solid pink;
			}
			img{
				vertical-align: bottom;
			}
		</style>
	</head>
	<body>
		<div>
			今天天气，<span>真不错</span>HelloHello
		</div>
		<!--<div>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Optio quis officiis minima id dolorem distinctio sapiente. Fugiat nemo libero itaque ea culpa animi odio quod eum quae id. Quaerat hic?</div>-->
		<p>
			<img src="webfonts/7.jpeg" alt="" />
		</p>
	</body>
</html>
